<template>
  <li
    class="m-detail-item">
    <dl class="section">
      <dd>
        <img
          :src="'data:image/png;base64,'+meta.img"
          :alt="meta.name">
      </dd>
      <dd>
        <h4>{{ meta.name }}</h4>
        <p>
          <span>剩余：1</span>
          <span>截止日期：2020.1.2</span>
        </p>
        <p>
          <span class="price">{{meta.sellPrice}}</span>
          <sub>门店价15</sub>
        </p>
      </dd>
      <dd>
        <el-button
          type="warning"
          round
          @click="createCart">立即抢购</el-button>
      </dd>
    </dl>
  </li>
</template>

<script>
  import * as homeApi from '@/server/home.js'
export default {
  props: {
    meta: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  methods: {
    createCart: function(){
      console.log(this.meta);
      var userId = localStorage.getItem("user");
      if(userId == null) {
        userId = 0;
      }
      homeApi.joinCart(this.meta.foodId, userId).then(result => {
        console.log(result);
        if(result.data.code == 200) {
          this.$message({
            message: '加入购物车成功',
            type: 'success'
          });
          location.reload();
        } else {
          this.$message({
            message: '服务器出错！',
            type: 'error'
          });
        }
      })
    }
  }
}
</script>
